<template>
	<view>
		<view class="popup-mask" v-show="show" @click="hideMenu"></view>
		<view class="popup" v-show="show" :style="'top:'+top+'rpx;'">
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			show:Boolean,
			top:{
				default:5,
				type:Number
			}
		},
		methods:{
			hideMenu(){
				this.$emit('hideMenu')
			}
		}
	}
</script>

<style lang="stylus">
	.popup-mask
		position fixed
		right 0
		left 0
		top 0
		bottom 0
		background rgba(0,0,0, 0.3)
		z-index 1999
	.popup
		position fixed
		right 0
		top 5rpx
		width 55%
		background #FFFFFF
		z-index 2000
		box-shadow 1rpx 1rpx 20rpx 2rpx #CCCCCC
</style>
